<script lang="ts">
export default {
  name: "kanban-quality-center"
};
</script>
<script setup lang="ts">
import { ref, onMounted } from "vue";

// import { queryCustReseInfo } from "@/api/ams/home";
const emergencyData = ref<any>([
  {
    id: 1,
    team: "班组1",
    createBy: "申请人1",
    name: "品名1",
    figureNumber: "别名1",
    num: 1,
    cargoLocation: "库房1",
    status: "检验中",
    checkUser: "检查员1",
    emergencyDegree: "非常紧急",
    inspection: "新品全检"
  },
  {
    id: 2,
    team: "班组2",
    createBy: "申请人2",
    name: "品名2",
    figureNumber: "别名2",
    num: 2,
    cargoLocation: "库房2",
    status: "检验中",
    checkUser: "检查员2",
    emergencyDegree: "非常紧急",
    inspection: "新品全检"
  }
]);
const waitData = ref<any>([
  {
    id: 3,
    team: "班组3",
    createBy: "申请人3",
    name: "品名3",
    figureNumber: "别名3",
    num: 3,
    cargoLocation: "库房3",
    status: "检验中",
    checkUser: "检查员1",
    emergencyDegree: "紧急",
    inspection: "新品全检"
  },
  {
    id: 4,
    team: "班组4",
    createBy: "申请人4",
    name: "品名4",
    figureNumber: "别名4",
    num: 4,
    cargoLocation: "库房4",
    status: "检验中",
    checkUser: "检查员2",
    emergencyDegree: "紧急",
    inspection: "新品全检"
  }
]);
const inspection = ["新品全检", "标准全检", "抽检", "复检", "三坐标"];
const doingData = ref<any>([]);
const searchEvent = () => {
  doingData.value = [];
  for (var i = 5; i < 11; i++) {
    doingData.value.push({
      id: i,
      team: "班组" + i,
      createBy: "申请人",
      name: "品名" + i,
      figureNumber: "别名" + i,
      num: i,
      cargoLocation: "库房",
      status: i % 2 == 0 ? "检验中" : "待检",
      checkUser: i % 2 == 0 ? "检查员2" : "检查员1",
      emergencyDegree: i % 2 == 0 ? "正常" : "不忙",
      inspection: inspection[i % 5]
    });
  }
};
onMounted(() => {
  searchEvent();
});
</script>
<template>
  <div class="box">
    <div class="tit">执行任务</div>
    <!-- <table></table> -->
    <div
      style="overflow-x: hidden; overflow-y: auto"
      :style="{
        width: 'calc(100% + 8px)',
        height: 'calc(100% - 45px)'
      }"
    >
      <div class="tableContent" style="height: 100%">
        <table class="taskTable qualityTable">
          <tr class="fixedtr">
            <th>报检班组</th>
            <th>报检人</th>
            <th>品名</th>
            <th>别名</th>
            <th style="width: 60px">数量</th>
            <th>地点</th>
            <th>接单状态</th>
            <th>检查员</th>
            <th>紧急程度</th>
            <th>检验形式</th>
          </tr>
          <tr v-for="item in emergencyData" :key="item.id">
            <td>{{ item.team }}</td>
            <td>{{ item.createBy }}</td>
            <td>{{ item.name }}</td>
            <td>{{ item.figureNumber }}</td>
            <td>{{ item.num }}</td>
            <td>{{ item.cargoLocation }}</td>
            <td>{{ item.status }}</td>
            <td>{{ item.checkUser }}</td>
            <td>{{ item.emergencyDegree }}</td>
            <td>{{ item.inspection }}</td>
          </tr>
          <tr v-for="item in waitData" :key="item.id">
            <td>{{ item.team }}</td>
            <td>{{ item.createBy }}</td>
            <td>{{ item.name }}</td>
            <td>{{ item.figureNumber }}</td>
            <td>{{ item.num }}</td>
            <td>{{ item.cargoLocation }}</td>
            <td>{{ item.status }}</td>
            <td>{{ item.checkUser }}</td>
            <td>{{ item.emergencyDegree }}</td>
            <td>{{ item.inspection }}</td>
          </tr>
          <tr v-for="item in doingData" :key="item.id">
            <td>{{ item.team }}</td>
            <td>{{ item.createBy }}</td>
            <td>{{ item.name }}</td>
            <td>{{ item.figureNumber }}</td>
            <td>{{ item.num }}</td>
            <td>{{ item.cargoLocation }}</td>
            <td>{{ item.status }}</td>
            <td>{{ item.checkUser }}</td>
            <td>{{ item.emergencyDegree }}</td>
            <td>{{ item.inspection }}</td>
          </tr>
        </table>
      </div>
    </div>
  </div>
</template>
<style lang="scss" scoped>
.tableContent {
  width: 100%;
  // height: calc(100% - 45px);
  overflow: auto;
}
.qualityTable tr th:nth-child(3),
.qualityTable tr td:nth-child(3),
.qualityTable tr th:nth-child(4),
.qualityTable tr td:nth-child(4),
.qualityTable tr th:nth-child(5),
.qualityTable tr td:nth-child(5),
.qualityTable tr th:nth-child(6),
.qualityTable tr td:nth-child(6),
.qualityTable tr th:nth-child(8),
.qualityTable tr td:nth-child(8) {
  font-size: 16px;
}
</style>
